{% extends 'EstocBundle:Collaborator:collaboratorHome.html.twig' %}

{% block stylesheets %}
    {{ parent() }}
{% endblock %}

{% block javascripts %}
    {{ parent() }}

{% endblock %}

{% block content_collaborator %}
    <div class="container-space home-container">
        <div class="menu_titulo clearfix pure-g">
            <div class="pure-u-2-3">IMÁGENES SUBIDAS</div>
            <div class="pure-u-1-3">RESUMEN DE CUENTAS</div>
            <hr />
        </div>
        <div class="clearfix pure-g">
            <div class="pure-u-2-3 container-kart-scroll">
                <ul class="menu_home clearfix pure-g">
                    {% for image in images %}
                        <li class="pure-u search-thumb">
                            <img class="image-link" src="{{ (vich_uploader_asset(image,'file')) | apply_filter('collaborator_upload_thumb') }}" />
                        </li>
                    {% endfor %}
                </ul>
            </div>
            <div class="pure-u-1-3">
                <div class="center-middle container-space">
                    <div class="pure-g">
                        <div class="pure-u-2-3 menu_titulo">IMÁGENES SUBIDAS:</div>
                        <div class="pure-u-1-3 align-right" id="cant_imagenes">{{ cant_images }}</div>
                    </div>
                    <div class="pure-g">
                        <div class="pure-u-2-3 menu_titulo">IMÁGENES VENDIDAS:</div>
                        <div class="pure-u-1-3 align-right" id="cant_purchases">{{ cant_purchases }}</div>
                    </div>
                    <div class="pure-g">
                        <div class="pure-u-2-3"></div>
                        <div class="pure-u-1-3"></div>
                    </div>
                    <div class="pure-g highlight">
                        <div class="pure-u-2-3 menu_titulo">TOTAL A COBRAR:</div>
                        <div class="pure-u-1-3 align-right" id="amount">${{ amount | number_format() }}</div>
                    </div>
                    <div class="pure-g">
                        <div class="pure-u-2-3"></div>
                        <div class="pure-u-1-3"></div>
                    </div>
                    <div class="align-center">
                        <div class="pure-u">
                            <button type="submit" class="btn">COBRAR</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="clearfix pure-g">
            <hr />
        </div>
    </div>
{% endblock %}
